@import './normalize.less';
@import './base.less';
@import './variable.less';

.mmb_search {
  margin-bottom: 0;
}
.title {
  border-top: 2px solid #e6e6e6;
  border-bottom: 2px solid #e6e6e6;
  height: 72rem/@base;
  background-image: linear-gradient(to bottom, #fbfbfb, #eee);
  line-height: 72rem/@base;
  padding-left: 16rem/@base;
  font-size: 24rem/@base;
  a {
    float: left;
    font-weight: 400;
  }
  span {
    float: left;
    height: 100%;
  }
}


.mmb_nav {
  h4 {
    height: 75rem/@base;
    line-height: 75rem/@base;
    padding-left: 20rem/@base;
    text-align: left;
    background-color: #f3f3f3;
    color: #7e3400;
    border-bottom: 2rem/@base solid #bdbdbd;
    font-weight: 400;
    font-size: 26rem/@base;
  }
  .item {
    ul {
      li {
        background-color: #fff;
        border-bottom: 2rem/@base solid #eaeaea;
        &:nth-child(1) {
          .left {
            background: #f10e0e;
          }
        }
        &:nth-child(2) {
          .left {
            background: #ff8c11;
          }
        }
        &:nth-child(3) {
          .left {
            background: #8bdf5c;
          }
        }
        a {
          position: relative;
          height: 130rem/@base;
          padding: 20rem/@base;
          .youjiantou {
            width: 22rem/@base;
            height: 36rem/@base;
            background: url(../images/right-arr.png) no-repeat;
            background-size: 22rem/@base 36rem/@base;
            position: absolute;
            top: 47rem/@base;
            right: 16rem/@base;
          }
          .left {
            float: left;
            width: 42rem/@base;
            height: 42rem/@base;
            line-height: 42rem/@base;
            text-align: center;
            background-color: #c9c9c9;
            color: #fff;
          }
          .right {
            float: right;
            width: 648rem/@base;
            p {
              &:nth-child(1) {
                line-height: 50rem/@base;
                font-size: 32rem/@base;
              }
              &:nth-child(2) {
                line-height: 40rem/@base;
                color: #8b8a8e;
                font-size: 26rem/@base;
              }
            }
          }
        }
      }
    }
  }
}
.mmb_list {
  background-color: #fff;
  h4 {
    height: 75rem/@base;
    line-height: 75rem/@base;
    padding-left: 20rem/@base;
    text-align: left;
    background-color: #f3f3f3;
    color: #7e3400;
    border-bottom: 2rem/@base solid #bdbdbd;
    font-weight: 400;
    font-size: 26rem/@base;
  }
  li {
    border-bottom: 2rem/@base solid #eaeaea;
    height: 235rem/@base;
    a {
      position: relative;
      padding: 20rem/@base;
      .left {
        width: 200rem/@base;
        float: left;
        height: 100%;
        img {
          height: 100%;
        }
      }
      .right {
        float: right;
        width: 495rem/@base;
        height: 100%;
        p {
          &:nth-child(1) {
            font-size: 26rem/@base;
            color: #192735;
            line-height: 45rem/@base;
            height: 90rem/@base;
          }
          &:nth-child(3) {
            line-height: 50rem/@base;
            font-size: 24rem/@base;
            color: #979aac;
          }
          .comment {
            margin-left: 20rem/@base;
          }
        }
        .price {
          line-height: 60rem/@base;
          color: #e6373e;
          font-size: 26rem/@base;
        }
      }
      .star {
        position: absolute;
        right: 20rem/@base;
        bottom: 60rem/@base;
        img {
          float: left;
          width: 40rem/@base;
          height: 40rem/@base;
        }
      }
    }
  }
}
.mmb_comment {
  background-color: #fff;
  padding-bottom: 50rem/@base;
  h4 {
    height: 75rem/@base;
    line-height: 75rem/@base;
    padding-left: 20rem/@base;
    text-align: left;
    background-color: #f3f3f3;
    color: #7e3400;
    border-bottom: 2rem/@base solid #bdbdbd;
    font-weight: 400;
    font-size: 26rem/@base;
  }
  .item {
    ul {
      li {
        padding: 20rem/@base;
        a {
          .left {
            float: left;
            width: 215rem/@base;
            height: 215rem/@base;
            img {
              height: 100%;
            }
          }
          .right {
            width: 480rem/@base;
            height: 215rem/@base;
            float: right;
            p {
              line-height: 45rem/@base;
              font-size: 26rem/@base;
              color: #8a8d91;
            }
          }
          .bottom {
            background-color: #f8f8f8;
            float: left;
            border: 2rem/@base solid #e7e7e7;
            padding: 20rem/@base;
            margin-top: 30rem/@base;
            position: relative;
            .top {
              line-height: 42rem/@base;
              height: 42rem/@base;
              .name {
                font-size: 22rem/@base;
                color: #6b5b2c;
              }
              .time {
                font-size: 22rem/@base;
                color: #a297a4;
              }
            }
            .center {
              font-size: 28rem/@base;
            }
            .down {
              position: absolute;
              width: 30rem/@base;
              height: 18rem/@base;
              background: url(../images/up.png) no-repeat center;
              background-size: 30rem/@base 18rem/@base;
              top: -17rem/@base;
              left: 80rem/@base;
            }
          }
        }
      }
    }
  }
}